<template>
  <view class="feedbackList page-wrap wrap-column page-content">
    <view class="feedback-tabs">
      <TopTabs
        key-name="name"
        :list-data="topTabs.list"
        :current="topTabs.current"
        @tabClick="handleSwitchPackWay"
      />
    </view>
    <view class="info-list">
      <scroll-view class="scroll-content" :scroll-y="true" style="height: 100%;">
        <view v-if="!infoList.length" class="result">
          <image :src="vuex_imgPath+'/empty2x.png'" />
          <view>矮油，这里空空如也~</view>
        </view>
        <view v-for="info in infoList " :key="info.id" class="info-model">
          <view class="info-title line info-line">
            <view class="info-code">
              <text class="info-label">反馈编号：{{ info.feedbackId }}</text>
            </view>
            <text class="info-status">{{ info.status== 10?'已接收' : '已回复' }}</text>
          </view>
          <view class="info-content line">
            <view class="info-line">
              <text class="info-label">反馈类型：{{ enumeratFn.getEnumerationName('freebackType',info.freebackType) }}</text>
            </view>
            <view class="info-line">
              <text class="info-label">问题类型：{{ enumeratFn.getEnumerationName('questionType',info.questionType) }}</text>
            </view>
            <view class="info-line">
              <text v-if="info.status== 10" class="info-label">反馈时间：{{ info.createTime !='1000-01-01 00:00:00'?info.createTime:'' }}</text>
              <text v-else class="info-label">回复时间：{{ info.replyTime !='1000-01-01 00:00:00'?info.replyTime:'' }}</text>
            </view>
          </view>
          <view class="info-link info-line" @click="linkFeedbackInfo(info.id,info.status)">
            查看详情<text class="icon iconfont icon-a-arrowright_tongyong_1 icon-youjiantou" />
          </view>
        </view>
        <u-loadmore v-if="infoList.length>0" :status="loadStatus" />
      </scroll-view>
      <view class="newFeedback" @click="linkFeedbackInfo('',0)">
        <text class="icon iconfont icon-yijianfankui_tongyong_1" />
      </view>
    </view>
  </view>
</template>

<script>
import TopTabs from '@/components/top-tabs';
import { searchFrontFreeBackList } from '@/api/yc_userInfo';
import { enumeratFn } from '@/common/enumeratCommon';
export default {
  name: 'FeedbackList',
  components: {
    TopTabs
  },
  data() {
    return {
      topTabs: {
        list: [ //
          { key: '10', name: '已接收' },
          { key: '20', name: '已回复' },
        ],
        current: 0
      },
      feedbackStatus: '10',
      page: 1,
      infoList: [],
      loadStatus: 'loadmore',
      enumeratFn,
    }
  },
  mounted() {
    this.getFeedbackList()
  },
  methods: {
    // 返回当前页调用刷新该页面的方法
    refreshRequest() {
      this.handleSwitchPackWay({ key: '10' })
    },
    linkFeedbackInfo(id, status) {
      uni.navigateTo({
        url: '/customerFeedbackBox/customerFeedback/feedbackInfo?status=' + status + '&id=' + id
      })
    },
    handleSwitchPackWay(item) {
      this.topTabs.current = item.key === '10' ? 0 : 1
      this.feedbackStatus = item.key
      this.page = 1
      this.getFeedbackList()
    },
    scrolltolower() {
      if (this.loadStatus == 'nomore' || this.loadStatus == 'loading') {
        return
      }
      this.page++
      this.searchMainQueryFn()
    },
    getFeedbackList() {
      var params = {
        'pageNum': this.page,
        'pageSize': 10,
        'questionType': '',
        'freebackType': '', //反馈类型
        'status': this.feedbackStatus,
      }
      console.log('444')
      searchFrontFreeBackList(params).then(res => {
        if (this.feedbackStatus != params.status) {
          return
        }
        if (res.errorCode != 0) {
          this.infoList = []
          this.$u.toast(res.msg)
          this.loadStatus = 'nomore'
          return
        }
        var list = res.data?.data || []
        if (Array.isArray(list)) {
          this.infoList = this.page == 1 ? this.infoList = list : this.infoList.concat(list)
          if (res.data.pageCount <= this.page) {
            this.loadStatus = 'nomore'
          } else {
            this.loadStatus = 'loadmore'
          }
        } else {
          this.loadStatus = 'nomore'
        }
        this.$forceUpdate()
      })
    },
  }
}
</script>
<style scoped lang="scss">
  .wrap-column {
    flex-direction: column;
    }
  .page-wrap {
    display: flex;
    }
.feedbackList{
  height: 100vh;
  overflow: hidden;
  .info-list{
    margin: 16rpx 32rpx 68rpx;
    overflow: hidden;
    .result{
      font-size: 24rpx;
      margin-top: 20rpx;
      color: #666666;
      text-align: center;
      font-weight: 400;
      image{
        width: 336rpx;
        height: 448rpx;
        margin-top: 40%;
        margin-bottom: 10rpx;
      }
    }
    .scroll-content{
      height: 100%;
      .info-model{
        background: #ffffff;
        font-weight: 600;
        font-size: 28rpx;
        color: #222222;
        margin-bottom: 16rpx;
        border-radius: 8rpx;
        .info-line{
          line-height: 72rpx;
          height: 72rpx;
          padding: 0 24rpx;
        }
        .info-label{
          font-weight: normal;
          margin-right: 16rpx;
        }
        .line{
          border-bottom: 2rpx solid #F5F5F5;
        }
        .info-code{display: inline-block;}
        .info-status{
          color: #FF6010;
          float: right;
        }
        .info-link{
          text-align: right;
          font-weight: normal;
          .icon{
            color: #aaaaaa;
          }
        }

      }
    }
    .newFeedback{
        width: 88rpx;
        height: 88rpx;
        line-height: 88rpx;
        text-align: center;
        position: fixed;
        top: calc(100vh - 330rpx);
        right: 30rpx;
        z-index: 99;
        border-radius: 50%;
        border:2rpx solid #E2E2E2;
        background: #ffffff;
        box-shadow: (0 8rpx 16rpx rgba(0,0,0,12%));
        .icon {
          color:#222222;
        font-size: 48rpx;
        }
    }
  }

}
</style>
